<template>
    <div class="view">
        <div class="boxers">
            <div class="func">
                <!-- <button @click="but">123456</button> -->
                <p class="title">IMAGINE_WEB</p>
                <div class="contentes" v-show="types == 1" style="background: #fff">
                    <p class="nameLogin">账号登录</p>
                    <el-input
                            type="text"
                            v-model.trim="formLabelAlign.userName"
                            placeholder="请输入登录账号"
                            class="userName"
                            maxlength="11"
                            style="margin-bottom: 20px"
                            @keyup.enter.native="login"
                    ></el-input>
                    <el-input
                            type="password"
                            v-model.trim="formLabelAlign.password"
                            placeholder="请输入登录密码"
                            maxlength="16"
                            auto-complete="off"
                            class="password"
                            style="margin-bottom: 20px"
                            @keyup.enter.native="login"
                    ></el-input>
                    <div style="display: flex; margin-bottom: 5px">
                        <el-input
                                type="text"
                                placeholder="请输入验证码"
                                v-model.trim="formLabelAlign.code"
                                class="code"
                        />
                        <!-- <input type="text" placeholder="请输入验证码"> -->
                        <img
                                style="z-index: 999999999999999"
                                width="90px"
                                :src="vsCode"
                                alt
                                class="imgFl"
                                @click="changeCodeImg()"
                        />
                    </div>
                    <div class="tipsInfo">{{ tipsInfo }}</div>
                    <div class="foot-btn" @click="login" @keyup.enter.native="login">
                        <el-button type="button">登 &nbsp;&nbsp;&nbsp;&nbsp;录</el-button>
                    </div>
                    <div class="forgetTxt" @click="handForget">忘记密码?</div>
                </div>
                <div class="contentes1 contentes3"
                     v-show="types == '3'"
                     style="width: 360px">
                    <div class="nameLogin goBackBox">
                        <div class="goBack">
                            <img src="../../assets/images/goBack.png" style="width:16px;height:16px" alt="">
                            <span style="color: rgb(64, 158, 255)" @click="backLogin">返回</span>
                        </div>
                        忘记密码
                    </div>
                    <div class="forgetPSWContent">
                        <el-input
                                type="text"
                                v-model.trim="setData.phone"
                                placeholder="请输入手机号"
                                class="userName userNames"
                                style="background: none"
                                @input="
                (value) => {
                  setData.phone = value.replace(/[^\d]/g, '');
                }
              "
                                maxlength="11"
                                @keyup.enter.native="login"
                        ></el-input>
                        <div class="linePSW">
                            <el-input
                                    type="text"
                                    v-model.trim="setData.phoneCode"
                                    placeholder="请输入验证码"
                                    class="userName userName1 userNames"
                                    maxlength="11"
                                    style="margin-bottom: 20px; background: none"
                                    @keyup.enter.native="login"
                            ></el-input>
                            <span
                                    class="getCode"
                                    @click="handelGetCode"
                                    v-if="phoneCode == '1001'"
                            >获取验证码
              </span>
                            <span class="getCode"
                                  :class="disabledCode == '3001' ? '' : 'disableSpan'"
                                  @click="handelGetCode"
                                  v-if="phoneCode == '1002'">重新获取 <span v-if="codeShow == 2001">({{ timers }})</span>
              </span>
                        </div>
                        <div class="foot-btn" @click="retrievePSW">
                            <el-button type="button">找回密码</el-button>
                        </div>
                        <div class="recallPSW">
                            <!-- <span style="color: #409eff" @click="backLogin">返回登录</span> -->
                        </div>
                    </div>
                </div>
                <!-- 保存修改 -->
                <div
                        class="contentes1 contentes3"
                        v-show="types == '4'"
                        style="width: 360px"
                >
                    <div class="nameLogin">

                        <div class="goBack">
                            <img src="../../assets/images/goBack.png" style="width:16px;height:16px" alt="">
                            <span style="color: rgb(64, 158, 255)" @click="backLogin2">返回</span>
                        </div>
                        找回密码
                    </div>
                    <div class="forgetPSWContent">
                        <el-input
                                type="password"
                                v-model.trim="setData.password"
                                placeholder="设置密码"
                                style="background: none"
                                class="userName userNames"
                        ></el-input>
                        <el-input
                                type="password"
                                v-model.trim="setData.again"
                                placeholder="确认密码"
                                style="margin-top: 20px; background: none"
                                class="userName userNames"
                        ></el-input>
                        <div class="foot-btn">
                            <el-button type="button" @click="preservationSetPsw"
                            >保存修改
                            </el-button
                            >
                        </div>
                    </div>
                </div>
                <!-- 马上登录 -->
                <div class="contentes1 contentes3" style="width:360px !important" v-show="types == '5'">
                    <p class="nameLogin">找回密码</p>
                    <div class="forgetPSWContent">
                        <div class="pswInfo">
                            您已经成功设置密码，3秒后系统将自动跳转到<span
                                style="color: #409eff; cursor: pointer"
                                @click="backLogin"
                        >登录页面</span
                        >
                        </div>
                        <div class="foot-btn">
                            <el-button type="button" @click="backLogin">马上登录</el-button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="foot">
            <span class="foot_son">京ICP备10215230号-3</span>
            <span>京公网安备 11010802023150号</span>
        </div>
        <el-dialog
                :visible.sync="dialogVisible"
                width="30%"
                :before-close="handleClose"
        >
            <div class="paschong">重置密码</div>
            <div class="box">
                <div class="listers">
                    <el-input
                            v-model="setData.phone"
                            placeholder="请输入手机号"
                    ></el-input>
                </div>
                <div class="listers">
                    <el-input
                            v-model="setData.phoneCode"
                            class="yzms"
                            placeholder="请输入验证码"
                    ></el-input>
                    <div class="fasong" @click="handCode">
                        <span v-if="!bools">发送验证码</span>
                        <span v-else>{{ second }}秒</span>
                    </div>
                </div>
                <!-- <a href="" id="asd"></a> -->
                <div class="footer" @click="resetPsw">找回密码</div>
                <div class="bankLog" @click="handLogo">返回登陆</div>
            </div>
        </el-dialog>
    </div>
</template>
<script>
    import https from "../../plugins/https";
    import {DecryptData, EncryptData} from '../../assets/js/aes'

    export default {
        data() {
            return {
                list: [
                    {
                        name:
                            "能接受的肯定就是咖啡和科技示范户收到货后数据库或多或少就只能靠回复",
                    },
                    {name: "能接受的"},
                    {name: "能接受的"},
                    // {name:"能接受的"},
                    // {name:"能接受的"},
                ],
                phoneCode: "1001", //获取验证码//重新获取
                loginType: "0001", //0001代表的是登录  0002代表的是忘记密码
                codeShow: "2001", //判断倒计时是否显示
                disabledCode: "3001", //判断获取验证码是否能点击
                setPswId: "",
                // 获取验证码的手机号
                phone: "",
                types: 1,
                tipsInfo: "",
                labelPosition: "right",
                num: "",
                vsCode: "",
                formLabelAlign: {
                    password: "",
                    userName: "",
                    code: "",
                },
                setData: {
                    phone: "", //手机号
                    id: "", //选择oem的id
                    phoneCode: "", //验证码
                    password: "", //密码
                    again: "", //再次输入密码
                },
                second: 60, //倒计时的秒数
                bools: false,
                dialogVisible: false,
                phone: "", //忘记密码  手机号
                verification: "", //忘记密码 验证码
                psw: "", //修改后的密码
                timers: 60,
                findPswTime: null,
            };
        },
        // 这里改了
        created() {
            let userName = localStorage.getItem("userName");
            if (userName && userName != "") {
                this.formLabelAlign.userName = userName;
            }
            this.formLabelAlign.code = "";
        },
        mounted: function () {
            window.scrollTo(0, 0);
            const _this = this;
            _this.changeCodeImg();
            var token = localStorage.getItem("token");
            if (token) this.$router.push({path: "/homePage"});
        },
        methods: {
            but() {
                // EncryptData("大家好")
                let data = 'jdsfhjdsk'
                let loh = EncryptData(data)
                console.log(loh)
                // setTimeout(()=>{
                console.log(DecryptData('t8RTbhsJHWgeBcEYfR/GpA=='))
                // },1000)
            },
            // $("#asd").hover(function{

            // }),
            //找回密码
            findPSW() {
                this.loginType = "0002";
                this.types = 2;
            },
            // 获取验证码
            handelGetCode() {
                if (this.setData.phone != "" && this.setData.phone.length > 0) {
                    if (this.disabledCode == "3001") {
                        https
                            .getCode({phone: this.setData.phone})
                            .then((res) => {
                                console.log(res);
                                if (res.data.code == "0000") {
                                    this.codeShow = "2001";
                                    console.log(res);
                                    this.phoneCode = "1002";
                                    this.disabledCode = "3002";
                                    this.findPswTime = setInterval(() => {
                                        if (this.timers > 0) {
                                            this.timers -= 1;
                                        } else {
                                            this.codeShow = "2002";
                                            this.disabledCode = "3001";
                                            this.timers = 60;
                                            clearInterval(this.findPswTime);
                                        }
                                    }, 1000);
                                } else {
                                    layer.open({
                                        content: res.data.msg,
                                        skin: "msg",
                                        time: 1, //1秒后自动关闭
                                    });
                                }
                            })
                            .catch((err) => {
                                console.log(err);
                            });
                    } else {
                        return false;
                    }
                } else {
                    layer.open({
                        content: "请输入手机号",
                        skin: "msg",
                        time: 1, //1秒后自动关闭
                    });
                }
            },
            // 找回密码
            retrievePSW() {
                if (this.setData.phone != "" && this.setData.phoneCode != "") {
                    https
                        .getUser({
                            phone: this.setData.phone,
                            phoneCode: this.setData.phoneCode,
                        })
                        .then((res) => {
                            console.log("获取出来的用户信息");
                            console.log(res);
                            if (res.data.code == "0000") {
                                this.list = res.data.data;
                                this.loginType = "0002";
                                this.types = 2;
                            } else {
                                layer.open({
                                    content: res.data.data.msg,
                                    skin: "msg",
                                    time: 1, //1秒后自动关闭
                                });
                            }
                            return;
                        })
                        .catch((err) => {
                            console.log(err);
                        });
                } else {
                    layer.open({
                        content: "手机号和验证码不能为空",
                        skin: "msg",
                        time: 1, //1秒后自动关闭
                    });
                }

                // 这里需要发送一个请求

                // 如果只有一个oem的时候 types变成4
                // this.types = 4;
                // 如果有多个的话  那么就让去选择修改哪个oem的密码
            },
            // 保存修改的密码
            preservationSetPsw() {
                // this.types = 5;
                if (this.setData.password != "" || this.setData.again != "") {
                    if (this.setData.password == this.setData.again) {
                        https
                            .confirmSetPsw(this.setData)
                            .then((res) => {
                                console.log("保存修改的密码状态");
                                if (res.data.code == "0000") {
                                    layer.open({
                                        content: res.data.msg,
                                        skin: "msg",
                                        time: 1, //1秒后自动关闭
                                    });

                                    this.types = 5;
                                    this.setData.phoneCode = "";
                                    this.setData.phone = "";
                                    this.setData.id = "";
                                    this.setData.password = "";
                                } else {
                                    return;
                                }
                                console.log(res);
                            })
                            .catch((err) => {
                                console.log(err);
                            });
                    } else {
                        layer.open({
                            content: "两次输入密码不一致",
                            skin: "msg",
                            time: 1, //1秒后自动关闭
                        });
                    }
                } else {
                    layer.open({
                        content: "密码输入不能为空",
                        skin: "msg",
                        time: 1, //1秒后自动关闭
                    });
                }
            },
            guan() {
                // window.location.href = "about:blank";
                window.close();
            },

            // 获取验证码
            handCode() {
                console.log("获取验证码");

                if (!/^1[34578]\d{9}$/.test(this.phone)) {
                    console.log("手机号码有误，请重填");
                    this.$alert("手机号输入有误", "提示", {
                        confirmButtonText: "确定",
                    });
                    return false;
                } else {
                    console.log("进入这里");
                    this.bools = true;
                    let timer = setInterval(() => {
                        console.log("进入定时器");
                        if (this.second > 0) {
                            this.second--;
                        } else {
                            this.bools = false;
                            this.second = 60;
                            clearInterval(timer);
                        }
                    }, 1000);
                    console.log("手机号正确");
                    return true;
                }
            },
            // 重置密码
            resetPsw() {
                if (!/^1[34578]\d{9}$/.test(this.phone)) {
                    this.$alert("手机号输入有误", "提示", {
                        confirmButtonText: "确定",
                    });
                } else if (this.verification == "") {
                    this.$alert("验证码不能为空", "提示", {
                        confirmButtonText: "确定",
                    });
                } else if (this.psw.length < 8) {
                    this.$alert("密码最少8位", "提示", {
                        confirmButtonText: "确定",
                    });
                } else {
                    alert("成功");
                }
            },
            // 普通代理登录
            into(val) {
                // 判断是从哪里过来的
                // 如果是登录过来的话，那么就走登录
                // 如果是找回密码得话，那么就types变成2

                // 0001走的是登录
                if (this.loginType == "0001") {
                    console.log(val);
                    this.$axios({
                        method: "post",
                        url: "/api/affirmLogin",
                        data: {
                            uid: val.uid,
                            oldPassword: val.oldPassword,
                            userName: val.userName,
                        },
                    }).then((res) => {
                        if (res.data.code == "0000") {
                            this.tipsInfo = "登录成功";
                            this.$router.push({
                                path: "/homePage",
                            });
                            this.$notify({
                                title: "登录成功",
                                message: "欢迎登录IMAGINE_WEB",
                                offset: 50,
                                type: "success",
                            });
                            console.log(res.data.data);
                            localStorage.setItem("uid", res.data.data.uid); //uid
                            localStorage.setItem("token", res.data.token); //token
                            // 存放系统用户名称
                            localStorage.setItem("sysUserName", res.data.data.sysUserName);
                            // 邀请码
                            localStorage.setItem("developCode", res.data.data.developCode);
                            localStorage.setItem(
                                "authenticationStatus",
                                res.data.data.authenticationStatus
                            );
                            this.$store.state.token = res.data.token;
                            res.data.data.agtType == "9"
                                ? (res.data.data.agtType = 2)
                                : res.data.data.agtType;
                            localStorage.setItem("jurisdiction", res.data.data.agtType); //权限字段
                            localStorage.setItem("name", res.data.data.name);
                        } else {
                            layer.open({
                                content: res.data.msg,
                                skin: "msg",
                                time: 2, //2秒后自动关闭
                            });
                        }
                    })
                        .catch((err) => {
                        });
                } else {
                    console.log(val);
                    this.types = 4;
                    this.setPswId = val.id;
                    this.setData.id = val.id;
                }
            },
            handLogo() {
                this.dialogVisible = false;
            },

            handleClose(done) {
                this.$confirm("确认关闭？")
                    .then((_) => {
                        done();
                    })
                    .catch((_) => {
                    });
            },

            /**** 获取验证码  ***/

            changeCodeImg() {
                var _this = this;
                _this.num = Math.ceil(Math.random() * 1000000);
                //_this.vsCode = _this.urltype + '/api/vsCode.jpg',
                // console.log(this.GLOBAL)
                _this.vsCode = this.GLOBAL.httpurl + "/manage/captcha?loginCode=" + _this.num;
            },

            /**** 登录账号  密码   验证码 ****/

            login() {
                let userName = localStorage.setItem(
                    "userName",
                    this.formLabelAlign.userName
                );

                // var myreg=/^1[34578]\d{9}$/;
                if (this.formLabelAlign.userName == "") {
                    this.openPhone();
                    return false;
                }

                if (this.formLabelAlign.password == "") {
                    this.openPass();
                    return false;
                }

                if (this.formLabelAlign.code == "") {
                    this.openCode();
                    return false;
                }

                this.$axios({
                    method: "post",
                    url: "/toLogin",
                    data: {
                        userName: this.formLabelAlign.userName,
                        password: this.formLabelAlign.password,
                        captcha: this.formLabelAlign.code,
                        uuid: this.num,
                    },
                }).then((res) => {
                    if (res.data.code === 10000) {

                        this.tipsInfo = "登录成功";
                        this.$router.push({
                            path: "/homePage",
                        });

                        this.$notify({
                            title: "登录成功",
                            message: "欢迎登录IMAGINE_WEB",
                            offset: 50,
                            type: "success",
                        });
                        console.log(res.data);
                        localStorage.setItem("token", res.data.token); //token
                        localStorage.setItem("userName", res.data.userName);
                        let data = res.data;
                        this.$store.commit('set_token', data["Authentication-Token"]);
                    } else {
                        this.tipsInfo = res.data.message;
                        this.changeCodeImg();
                    }
                }).catch((err) => {
                    this.tipsInfo = "服务请求超时，稍后再试！！";
                });
            },
            // 想起密码
            backLogin() {
                this.setData.phone = "";
                this.setData.phoneCode = "";
                this.phoneCode = "1001";
                this.timers = 60;
                this.disabledCode = "3001";
                clearInterval(this.findPswTime);
                this.types = 1;
            },
            backLogin1() {
                if (this.loginType == "0002") {
                    this.types = 3
                } else {
                    this.types = 1
                }
            },
            backLogin2() {
                this.types = 2
            },
            // 暂不登录
            logins() {
                this.types = 1;
            },
            openPhone() {
                this.tipsInfo = "登录账号不能为空！";
            },
            openPass() {
                this.tipsInfo = "登录密码不能为空！";
            },
            openCode() {
                this.tipsInfo = "验证码不能为空！";
            },
            handForget() {
                this.types = 3;
            },
        },
        beforeDestroy() {
            this.tipsInfo = "";
        },
    };
</script>
<style scoped>
    .view {
        background: url("../../assets/images/back.png") no-repeat rgb(73, 78, 94);
        width: 100%;
        height: 100vh;
        background-size: 100% 100%;
    }

    .view-box {
        padding-top: 12%;
    }

    .view-title {
        font-size: 16px;
        color: black;
        text-align: center;
        padding-top: 10px;
    }

    .title {
        text-align: center;
        font-size: 32px;
        font-family: Microsoft YaHei;
        font-weight: 500;
        line-height: 47px;
        color: #fff;
        width: 520px;
        letter-spacing: 4px;
        opacity: 1;
        margin-bottom: 30px;
    }

    .middle {
        width: 440px;
        margin-left: 30px;
        height: 280px;
        overflow-y: auto;
        overflow-x: hidden;
    }

    .box-all {
        padding-top: 10px;
        opacity: 1;
        border-radius: 3px;
        border: 1px solid #e7f8ee;
        width: 380px;
        height: 360px;
        margin: 0 auto;
        border: 1px solid #e7eaec;
    }

    .all-int {
        width: 260px;
        margin: 0 auto;
        margin-top: 8%;
    }

    .el-button {
        display: inline-block;
        line-height: 1;
        white-space: nowrap;
        cursor: pointer;
        border: 0px solid #e7eaec;
        color: #fff;
        -webkit-appearance: none;
        text-align: center;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        outline: 0;
        margin: 0;
        -webkit-transition: 0.1s;
        transition: 0.1s;
        font-weight: 500;
        font-size: 15px;
        border-radius: 4px;
        width: 100%;
        background: transparent;
    }

    .el-input >>> .el-input__inner {
        background-color: transparent;
    }

    .el-form >>> .el-form-item {
        margin-bottom: 22px;
        width: 95%;
    }

    .el-form-item >>> .el-form-item__label {
        font-size: 15px;
    }

    .foot-text {
        text-align: center;
        margin-top: 20px;
        color: #fff;
        font-size: 14px;
    }

    .el-input >>> #email {
        width: 100%;
        float: left;
    }

    .imgFl {
        width: 100px;
        height: 40px;
        display: inline-block;
        margin-left: 15px;
    }

    .email-code >>> .el-input {
        width: 35%;
    }

    .clear {
        clear: both;
    }

    /deep/ .el-input {
        width: 300px;
        display: block;
    }

    .boxers {
        width: 520px;
        height: 480px;
        display: flex;
        position: absolute;
        padding: 50px 0px;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        border-radius: 20px;
        padding-top: 0;
    }

    .foot {
        position: absolute;
        bottom: 20px;
        left: 50%;
        transform: translate(-50%, -50%);
        color: #ffffff;
    }

    .foot_son {
        margin-right: 20px;
    }

    /deep/ .code {
        width: 200px !important;
    }

    h1 {
        font-size: 26px;
        height: 30px;
        line-height: 30px;
        margin-bottom: 20px;
    }

    .foot-btn {
        width: 300px;
        margin-top: 30px;
        margin-left: 30px;
        background: #2881d9;
        border-radius: 4px;
    }

    .foot-btns {
        width: 440px;
        margin-top: 30px;
        margin-left: 30px;
        position: fixed;
        bottom: 20px;
        background: #2881d9;
        border-radius: 4px;
    }

    /deep/ .el-input__inner {
        text-indent: 15px;
    }

    .tipsInfo {
        height: 20px;
        margin-left: 30px;
        color: rgb(243, 33, 33);
        margin-bottom: 20px;
    }

    .userName {
        background: url("../../assets/images/user.png") no-repeat 25px center;
        padding-left: 15px;
        margin-top: 40px;
        margin-left: 15px;
    }

    .password {
        background: url("../../assets/images/lock.png") no-repeat 25px center;
        padding-left: 15px;
        margin-left: 15px;
    }

    .code {
        background: url("../../assets/images/code.png") no-repeat 25px center;
        padding-left: 15px;
        margin-left: 15px;
    }

    /deep/ .el-input .el-input__inner {
        color: black !important;
        width: 300px !important;
        height: 40px !important;
    }

    /deep/ .code .el-input__inner {
        color: black !important;
    }

    .el-input[data-v-13ebe204] .el-input__inner {
        color: black !important;
    }

    .forgetTxt {
        color: #409eff;
        width: 80%;
        cursor: pointer;
        margin: 0 auto;
        margin-top: 5px;
    }

    .paschong {
        text-align: center;
        font-weight: bold;
        font-size: 20px;
        margin-bottom: 20px;
    }

    /deep/ .yzms .el-input__inner {
        width: 200px !important;
    }

    .listers {
        text-align: center;
        width: 300px;
        margin: 0 auto;
        margin-bottom: 20px;
        display: flex;
    }

    .fasong {
        width: 150px;
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgb(47, 144, 251);
        color: white;
        cursor: pointer;
    }

    .footer {
        cursor: pointer;
        text-align: center;
        width: 300px;
        margin: auto;
        background: rgb(64, 88, 105);
        height: 40px;
        line-height: 40px;
        color: white;
    }

    .bankLog {
        cursor: pointer;
        text-align: center;
        width: 300px;
        margin: 0 auto;
        margin-top: 20px;
    }

    >>> .el-button span {
        font-size: 18px;
    }

    .contentes {
        width: 360px;
        margin-left: 80px;
        height: 400px;
        padding-top: 10px;
        border-radius: 4px;
    }

    .contentes1 {
        width: 500px;
        height: 400px;
        padding-top: 10px;
        border-radius: 4px;
        background: #fff;
        overflow-y: auto;
    }

    .contentes3 {
        width: 400px;
        margin: 0 auto;
    }

    .nameLogin {
        text-align: center;
        font-size: 20px;
        margin-top: 30px;
        margin-bottom: 40px;
        font-weight: 400;
        position: relative;
    }

    .middle_son {
        display: flex;
        align-items: center;
        width: 440px;
        min-height: 50px;
        background: #f9fafc;
        margin-bottom: 10px;
        float: left;
    }

    .middle_con {
        width: 336px;
        float: left;
        margin-top: 5px;
    }

    .middle_img {
        width: 22px;
        height: 100%;
        float: left;
        margin: 13px 10px;
    }

    .middle_img1 {
        width: 56px;
        height: 100%;
        padding: 0px;
        float: left;
        margin: 13px 10px;
        cursor: pointer;
    }

    .middle_span1 {
        display: inline-block;
        font-size: 14px;
        color: #606266;
        width: 100%;
    }

    .middle_span2 {
        font-size: 12px;
        color: #909399;
        display: inline-block;
        width: 100%;
    }

    .userName1 {
        margin-top: 20px !important;
        width: 200px !important;
    }

    .linePSW {
        display: flex;
        align-items: center;
    }

    .getCode {
        width: 100px;
        display: block;
        text-align: center;
        background: #2881d9;
        height: 40px;
        line-height: 40px;
        color: white;
        margin-left: 15px;
        border-radius: 4px;
        cursor: pointer;
    }

    .recallPSW {
        margin-left: 30px;
        margin-top: 10px;
        cursor: pointer;
    }

    .pswInfo {
        text-align: center;
        width: 220px;
        color: #606266;
        margin: 0 auto;
    }

    .disableSpan {
        background: #d8dce6;
        color: #606266;
    }

    .goBack {
        display: flex;
        align-items: center;
        position: absolute;
        left: 20px;
        cursor: pointer;
    }

    /deep/ .userNames .el-input__inner {
        text-indent: 0 !important;
    }

    .goBackBox {
        display: flex;
        align-items: center;
        position: relative;
        justify-content: center;
    }

    .el-icon-arrow-left {
        color: red;
    }

    /deep/ .userName1 .el-input__inner {
        width: 100% !important;
    }
</style>
